<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<title>模版</title>
		<!--  微信js的引用配置  -->
		<meta charset="utf-8" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<meta name="format-detection" content="telephone=no" />
		<meta http-equiv="Pragma" content="no-cache" />
		<meta http-equiv="Cache-Control" content="no-cache" />
		<meta equiv="Expires" content="0" />

		<script>
			let screen_width = document.documentElement.clientWidth || document.body.clientWidth;
			let screen_height = document.documentElement.clientHeight || document.body.clientHeight;
            const designWidth = 750;
            const designHeight = 1334;
		</script>

		<meta id="eqMobileViewport" name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
		<script src="js/viewport.min.js"></script>

		<link rel="stylesheet" type="text/css" href="css/animate.min.css" />
		<link rel="stylesheet" type="text/css" href="css/common.css" />
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<script>
			var sysParam = {
				aid: '', //活动aid
				wxId: '', //用户id
				baseUrl: '', //游戏图片路径
				isAttention: '', //*用户是否已关注
				version: '', //资源版本
				musicUrl: '', //音频路径
				activity_desc: '', //活动规则

				userImg: '',
				nickname: '',

				isSharePage: `<?php echo $isSharePage?>`, //1-助力页，0-普通页
				isHelp: `<?php echo $isHelp?>`, //1助力成功2重复助力3助力次数已用完

				taskListApi: "<?php echo AU('game/task')?>", // 任务列表
				fillCardApi: "<?php echo AU('game/preClaim')?>", // 填卡任务领取
				pushApi: "<?php echo AU('game/helpClaim')?>", // 助力任务领取
				signUpApi: "<?php echo AU('game/signClaim')?>", // 签到任务领取
				finalTaskApi: "<?php echo AU('game/lastClaim')?>", // 最终任务领取
				verifyApi: "<?php echo AU('game/writeOff')?>", // 核销
				myGiftApi: "<?php echo AU('game/myPrizes')?>", // 我的奖品
				submitDataApi:`<?php echo AU('game/upExtend')?>`, // 上传数据
				awardList: `<?php echo AU('game/awardList')?>`, // 中奖名单
			};
			let settings = {};
		</script>
		<script>
			let popFrom = { y: '-100%', autoAlpha: 0 };
			let popIn = { y: 0, autoAlpha: 1 };
			let popOut = { y: '100%', autoAlpha: 0 };
		</script>
		<style>
			.lottery_avatar {
				width: 93rem;height: 93rem;
			}
			.lottery_name {
				width: 166rem;height: 24rem;
				font-size: 24rem;
				color: #5786a3;
				font-family: 'Arial';
			}
			.lottery_gift {
				width: 94rem;height: 24rem;
				font-size: 24rem;
				color: #5786a3;
				font-family: 'Arial';
			}
			.mygift_avatar {
				width: 139rem;height: 139rem;
			}
			.mygift_name {
				font-size: 24rem;
				max-width: 216rem;
				margin: 4rem;
				font-family: 'Arial';
				color: #22aeff;
			}
			.mygift_gift {
				width: 165rem;height: 57rem;
			}
			.statusBtn {
				width: 165rem;
				height: 70rem;
			}
            .showInfo1Text {
                font-family: Arial;
				font-size: 48rem;
				color: #5786a3;
				left: 158rem;
    			top: 108rem;
            }
			.showInfo2Title {
				left: 94rem;
				top: -146rem;
				width: 523rem;
				height: 211rem;
			}
			.showInfo2Img {
				left: 222rem;
				top: 140rem;
				width: 219rem;
				height: 185rem;
			}
			.showInfo2Content {
				left: 22rem;
				top: 396rem;
				width: 477rem;
				height: 33rem;
			}
		</style>
	</head>
	<body>
		<section v-cloak id="app">
			<transition name="fade">
				<section class="pointer_events_none loading container dis_none" id="loading">
					<div class="loadingBox">
						<p class="flex align_center justify_center">
							<img src="images/logo.png" />
						</p>
						<span class="l-1">i</span>
						<span class="l-2">-</span>
						<span class="l-3">l</span>
						<span class="l-4">z</span>
						<span class="l-5">.</span>
						<span class="l-6">c</span>
						<span class="l-7">n</span>
						<div class="loadingLine">
							<div></div>
						</div>
					</div>
				</section>
			</transition>

			<section v-cloak class="body" :style="{'--body-width': width+'rem', '--body-height': height+'rem', '--app-scale': 1}">
				<div class="page pages index">
					<span class="pages background_size_cover bg" v-bg="'images/index/背景.png'"></span>
					<span class="absolute ir effect btn_rule" v-lefty="99" v-top="99" v-bg="'images/index/主标题.png'" @click=""></span>
					<span class="absolute ir effect btn_rule" v-lefty="31" v-top="25" v-bg="'images/index/LOGO.png'" @click=""></span>
					<span class="absolute ir effect btn_rule" v-lefty="-1000" v-top="0" v-bg="'images/index/主体.png'" @click=""></span>
					<span class="absolute ir effect btn_rule" v-lefty="241" v-top="1076" v-bg="'images/index/完成任务.png'" @click="showPage('taskList')"></span>
					<span class="absolute ir effect btn_rule" v-lefty="36" v-top="1185" v-bg="'images/index/活动规则.png'" @click="showPop('rule')"></span>
					<span class="absolute ir effect btn_rule" v-lefty="270" v-top="1185" v-bg="'images/index/中奖名单.png'" @click="showPop('lottery')"></span>
					<span class="absolute ir effect btn_rule" v-lefty="504" v-top="1185" v-bg="'images/index/我的奖品.png'" @click="showPop('mygift_have')"></span>
					<span class="absolute ir effect btn_rule" v-lefty="147" v-top="988" v-bg="'images/index/选择门店.png'" @click="chooseShop()"></span>
<!--					<span class="absolute ir effect btn_rule" v-lefty="504" v-top="1285" v-bg="'images/index/我的奖品.png'" @click="showPop('task2_coupon10')"></span>-->
				</div>

				<div class="pop rule">
					<span class="ce lazy ir pop_content" data-src="images/rule/底框拷贝2.png">
						<span class="absolute ir effect btn_rule" v-lefty="44" v-topy="-55" v-bg="'images/rule/小标题拷贝2.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="11" v-topy="682" v-bg="'images/rule/黑猫拷贝.png'"></span>
						<!-- <span v-pop="'mygift'" class="absolute ir effect btn_rule animated bounceInLeft" v-topy="-150" v-lefty="138" v-bg="'images/mygift/小标题拷贝.png'"></span>-->
						<span class="absolute ir effect btn_rule" style="font-size: 32rem;" v-lefty="11" v-topy="100">{{activeRule}}</span>
						<span class="mCe ir effect btn_rule" v-topy="253" v-lefty="50" v-bg="'images/rule/icon拷贝.png'"></span>
						<span class="absolute ir effect btn_rule" v-topy="489" v-lefty="155" v-bg="'images/rule/您的背包空空如也_快去完成任务，获得奖品吧.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
				</div>

				<div class="page pages taskList">
					<span class="pages background_size_cover bg" v-bg="'images/taskList/背景1.png'"></span>
					<span class="absolute ir effect btn_rule" v-lefty="40" v-top="37" v-bg="'images/taskList/返回首页.png'" @click="pageShow('index')"></span>
					<span class="absolute ir effect btn_rule" v-lefty="616" v-top="66" v-bg="'images/taskList/黑猫.png'"></span>
					<span class="mCe lazy ir pop_content" v-top="202" data-src="images/taskList/底框.png">
						<span class="mCe ir effect btn_rule" v-topy="-63" v-bg="'images/taskList/小标题.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="22" v-topy="107" v-bg="'images/taskList/组_2.png'">
							<span class="absolute ir effect btn_rule" v-lefty="23" v-topy="45" v-bg="'images/taskList/任务一：填写萌宠卡档案.png'"></span>
							<span class="absolute ir effect btn_rule statusBtn" v-lefty="444" v-topy="25" v-bg="taskDataList[0].statusBtnUrl" @click="taskBtnClicked(0)">
								<span style="position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);color: #fff;line-height: 64rem;text-align: center;">{{taskDataList[0].statusText}}</span>
							</span>
						</span>
						<span class="absolute ir effect btn_rule" v-lefty="22" v-topy="261" v-bg="'images/taskList/组_2.png'">
							<span class="absolute ir effect btn_rule" v-lefty="23" v-topy="45" v-bg="'images/taskList/任务二：邀朋友一起膨胀.png'"></span>
							<span class="absolute ir effect btn_rule statusBtn" v-lefty="444" v-topy="25" v-bg="taskDataList[1].statusBtnUrl" @click="taskBtnClicked(1)"></span>
						</span>
						<span class="absolute ir effect btn_rule" v-lefty="22" v-topy="415" v-bg="'images/taskList/组_2.png'">
							<span class="absolute ir effect btn_rule" v-lefty="23" v-topy="45" v-bg="'images/taskList/任务三：打卡领好运御守.png'"></span>
							<span class="absolute ir effect btn_rule statusBtn" v-lefty="444" v-topy="25" v-bg="taskDataList[2].statusBtnUrl" @click="taskBtnClicked(2)"></span>
						</span>
						<span class="absolute ir effect btn_rule" v-lefty="22" v-topy="568" v-bg="'images/taskList/组_2.png'">
							<span class="absolute ir effect btn_rule" v-lefty="23" v-topy="45" v-bg="'images/taskList/任务四：升级宠物主权益.png'"></span>
							<span class="absolute ir effect btn_rule statusBtn" v-lefty="444" v-topy="25" v-bg="taskDataList[3].statusBtnUrl" @click="taskBtnClicked(3)"></span>
						</span>
						<span class="absolute ir effect btn_rule" v-lefty="22" v-topy="722" v-bg="'images/taskList/组_2.png'">
							<span class="absolute ir effect btn_rule" v-lefty="23" v-topy="45" v-bg="'images/taskList/最终任务：大满贯抽豪礼.png'"></span>
							<span class="absolute ir effect btn_rule statusBtn" v-lefty="444" v-topy="25" v-bg="taskDataList[4].statusBtnUrl" @click="taskBtnClicked(4)"></span>
						</span>
					</span>
					<span class="mCe bottom0 ir effect lazy" data-src="images/taskList/前景.png"></span>
				</div>

				<div class="pop mygift">
					<span class="ce lazy ir pop_content" data-src="images/mygift/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-topy="-150" v-lefty="138" v-bg="'images/mygift/小标题拷贝.png'"></span>
<!-- <span v-pop="'mygift'" class="absolute ir effect btn_rule animated bounceInLeft" v-topy="-150" v-lefty="138" v-bg="'images/mygift/小标题拷贝.png'"></span>-->
						<span class="mCe ir effect btn_rule" v-topy="253" v-lefty="50" v-bg="'images/mygift/icon拷贝.png'"></span>
						<span class="absolute ir effect btn_rule" v-topy="489" v-lefty="155" v-bg="'images/mygift/您的背包空空如也_快去完成任务，获得奖品吧.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
				</div>

				<div class="pop mygift_have">
					<span class="ce lazy ir pop_content" data-src="images/lottery/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="128" v-topy="-150" v-bg="'images/mygift/小标题拷贝.png'"></span>
						<span id="mygift_have" class="absolute" style="width: 95%;height: 520rem;left: 20rem;top: 60rem;right: 20rem;overflow: hidden;">
							<div class="relative">
								<div class="relative flex align_center" style="width: 100%;height: 180rem;padding-right: 60rem;"
									 v-for="(item, index) in myGiftDataList">
									<span class="relative ir effect btn_rule ml_60 mygift_avatar" v-bg="'images/mygift_have/矩形798.png'"></span>
									<span class="relative ir effect btn_rule mygift_name">{{item.prize_name}}</span>
<!-- 									<span class="relative ir effect btn_rule ml_10 mygift_gift" v-bg="'images/mygift_have/实物礼1份（透明御守）+门店权益1份.png'"></span> -->
 									<span class="relative ir effect btn_rule ml_auto mygift_gift"
										@click="currentChoosedItem = item;showPop('inputAddress')"
										v-bg="'images/mygift_have/填写地址.png'"></span>
								</div>
							</div>
						</span>
                        <span v-if="myGiftDataList.length===0" class="absolute ir effect btn_rule" >
                            <span class="absolute ir effect btn_rule" v-lefty="210" v-topy="180" v-bg="'images/mygift/icon拷贝.png'"></span>
                            <span class="absolute ir effect btn_rule" v-lefty="148" v-topy="459" v-bg="'images/mygift/您的背包空空如也_快去完成任务，获得奖品吧.png'"></span>
                        </span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
				</div>

                <!--============Task1==============-->
				<div class="pop task1_success">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="94" v-topy="-145" v-bg="'images/task1/小标题成功.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="222" v-topy="141" v-bg="'images/task1/icon拷贝2.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="92" v-topy="397" v-bg="'images/task1/您已完成任务一，获得实物礼一份.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
				</div>
				<div class="pop task1_kexi">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="94" v-topy="-145" v-bg="'images/task1/小标题可惜.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="222"  v-topy="141" v-bg="'images/task1/icon拷贝2.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="92" v-topy="397" v-bg="'images/task1/今日奖品已被领完，明天再来吧.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
				</div>
				<div class="pop task1_yihan">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="94" v-topy="-145" v-bg="'images/task1/小标题遗憾.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="222" v-topy="141" v-bg="'images/task1/icon拷贝2.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="92" v-topy="397" v-bg="'images/task1/领奖时间已结束，但您仍可点亮任务.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
				</div>
                <!--============Task2==============-->
                <div class="pop task2_share" @click="close" style="width: 100%; height: 100%;">
					<span class="ce lazy ir pop_content" data-src="">
						<span class="absolute ir effect btn_rule" v-lefty="469" v-topy="25" v-bg="'images/task2/猫爪.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="46" v-topy="264" v-bg="'images/task2/点击右上角邀请好友填写萌宠卡.png'"></span>
					</span>
                </div>
                <div class="pop task2_10">
					<span class="ce lazy ir pop_content" data-src="images/task2/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="108" v-topy="-150" v-bg="'images/task2/小标题拷贝.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="127" v-topy="131" v-bg="'images/task2/优惠券10.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="92" v-topy="382" v-bg="'images/task2/您已邀请三位好友填写萌宠卡档案获得109-30优惠券1张.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="227" v-topy="467" v-bg="'images/task2/确定.png'" @click=""></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>
                <div class="pop task2_30">
					<span class="ce lazy ir pop_content" data-src="images/task2/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="108" v-topy="-150" v-bg="'images/task2/小标题拷贝.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="127" v-topy="131" v-bg="'images/task2/优惠券30.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="92" v-topy="382" v-bg="'images/task2/您已邀请五位好友填写萌宠卡档案获得109-50优惠券1张.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="227" v-topy="467" v-bg="'images/task2/确定.png'" @click=""></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>
                <div class="pop task2_50">
					<span class="ce lazy ir pop_content" data-src="images/task2/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="108" v-topy="-150" v-bg="'images/task2/小标题拷贝.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="127" v-topy="131" v-bg="'images/task2/优惠券50.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="92" v-topy="382" v-bg="'images/task2/您已邀请五位好友填写萌宠卡档案获得109-50优惠券1张.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="227" v-topy="467" v-bg="'images/task2/确定.png'" @click=""></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>
                <!--============Task3==============-->
                <div class="pop task3_success">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="94" v-topy="-145" v-bg="'images/task1/小标题成功.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="198" v-topy="92" v-bg="'images/task3/矩形7.png'">
						    <span class="absolute ir effect btn_rule" v-lefty="87" v-topy="9" v-bg="'images/task3/占位.png'"></span>
						    <span class="absolute ir effect btn_rule" v-lefty="28" v-topy="158" v-bg="'images/task3/门店权益.png'"></span>
                        </span>
						<span class="absolute ir effect btn_rule" v-lefty="84" v-topy="382" v-bg="'images/task3/您已完成任务三，获得实物礼1份（透明御守）+门店权益1份.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>
                <div class="pop task3_yihan">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="94" v-topy="-145" v-bg="'images/task1/小标题遗憾.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="222" v-topy="141" v-bg="'images/task1/icon拷贝2.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="92" v-topy="397" v-bg="'images/task3/活动时间已过，您无法获得奖品.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>
                <!--============Task4==============-->
                <div class="pop task4_success">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="94" v-topy="-145" v-bg="'images/task1/小标题成功.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="127" v-topy="131" v-bg="'images/task4/优惠券.png'">
						    <span class="absolute ir effect btn_rule" v-lefty="303" v-topy="69" v-bg="'images/task4/蛋糕.png'"></span>
                        </span>
						<span class="absolute ir effect btn_rule" v-lefty="84" v-topy="382" v-bg="'images/task4/您已完成任务四，获得满20-10元优惠券1张、生日礼升级.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>
                <div class="pop task4_yihan">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="94" v-topy="-145" v-bg="'images/task1/小标题遗憾.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="222" v-topy="141" v-bg="'images/task1/icon拷贝2.png'"></span>
						<span class="mCe ir effect btn_rule" v-topy="397" v-bg="'images/task4/奖品已被领完.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>
                <!--============Task5==============-->
                <div class="pop task5_success">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="94" v-topy="-145" v-bg="'images/task1/小标题成功.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="127" v-topy="131" v-bg="'images/task5/优惠券.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="84" v-topy="382" v-bg="'images/task5/您已完成所有任务，获得抽奖券1张.png'"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>

                <div class="pop lottery">
					<span class="ce lazy ir pop_content" data-src="images/lottery/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="138" v-topy="-150" v-bg="'images/lottery/小标题拷贝.png'"></span>
						<!-- <span v-pop="'mygift'" class="absolute ir effect btn_rule animated bounceInLeft" v-topy="-150" v-lefty="138" v-bg="'images/mygift/小标题拷贝.png'"></span>-->
						<!--<span id="lottery" class="absolute" style="width: 95%;height: 500rem;left: 20rem;top: 60rem;right: 20rem;overflow: hidden; border: 1px solid gray!important; ">
							<div class="relative">
								<div class="relative" style="width: 100%;height: 90rem;border: 1rem solid red!important;" v-for="(item, index) in [0,1,2,3,4,5,6,7,8,9,10,11,12,13]">
									<span class="absolute ir effect btn_rule" v-lefty="50" v-topy="0" v-bg="'images/lottery/椭圆1055.png'"></span>
									<span class="absolute ir effect btn_rule" v-lefty="250" v-topy="40" v-bg="'images/lottery/昵称.png'"></span>
									<span class="absolute ir effect btn_rule" v-lefty="500" v-topy="40" v-bg="'images/lottery/奖品名称.png'"></span>
								</div>
							</div>
						</span>-->
						<span id="lottery" class="absolute" style="width: 95%;height: 500rem;left: 20rem;top: 60rem;right: 20rem;overflow: hidden;">
							<div class="relative">
								<!-- <div class="relative flex align_center"
										style="width: 100%;height: 120rem;padding-right: 60rem;z-index: 1000;"
										v-for="(item, index) in lotteryDataList">
									<span class="relative ir effect btn_rule ml_60 lottery_avatar" v-bg="item.avatar"></span>
									<span class="relative ir effect btn_rule ml_40 lottery_name">{{item.nickname}}</span>
									<span class="relative ir effect btn_rule ml_auto lottery_gift">{{item.giftName}}</span>
								</div> -->
								<span class="absolute ir effect btn_rule" style="width: 100%;height: 100%;" v-lefty="50" v-topy="0" v-bg="lotteryImage"></span>
							</div>
						</span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
				</div>

				<div class="pop verify">
					<span class="ce lazy ir pop_content" data-src="images/showInfo/矩形935拷贝2.png">
						<span class="absolute ir effect btn_rule" v-lefty="210" v-topy="26" v-bg="'images/verify/核销.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="40" v-topy="102" v-bg="'images/verify/矩形1109.png'"></span>
						<input class="absolute ir effect btn_rule" v-bind:value="inputCode" v-lefty="80" v-topy="125" style="font-size: 32rem;" placeholder="请输入核销码"/>
						<span class="absolute ir effect btn_rule" v-lefty="138" v-topy="285" v-bg="'images/verify/21-核销.png'" @click="verify()"></span>
						
					</span>
					<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
				</div>

                <div class="pop zhuli_success">
					<span class="ce lazy ir pop_content" data-src="images/showInfo/矩形935拷贝2.png">
						<span class="absolute ir effect btn_rule" v-lefty="66" v-topy="74" v-bg="'images/showInfo/矢量智能对象拷贝17.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="159" v-topy="109" ></span>
						<span class="absolute ir effect btn_rule" v-lefty="158" v-topy="285" v-bg="'images/showInfo/知道了.png'" @click="close"></span>
					</span>
                </div>
                <div class="pop zhuli_fail">
					<span class="ce lazy ir pop_content" data-src="images/showInfo/矩形935拷贝2.png">
						<span class="mCe ir effect btn_rule"  v-topy="109" v-bg="'images/tips/您还没填写萌宠卡，助力失败.png'"></span>
						<span class="absolute ir effect btn_rule" v-lefty="51" v-topy="285" v-bg="'images/tips/知道了.png'" @click="close"></span>
						<span class="absolute ir effect btn_rule" v-lefty="275" v-topy="285" v-bg="'images/tips/去填写.png'" @click="goTask(1)"></span>
					</span>
                </div>

				<div class="pop showInfo1">
					<span class="ce lazy ir pop_content" data-src="images/showInfo/矩形935拷贝2.png">
						<span class="absolute ir effect btn_rule" v-lefty="66" v-topy="74" v-bg="'images/showInfo/矢量智能对象拷贝17.png'"></span>
						<span class="absolute ir effect btn_rule showInfo1Text" v-lefty="159" v-topy="109">{{showInfo1.content}}</span>
						<span class="absolute ir effect btn_rule" v-lefty="158" v-topy="285" v-bg="'images/showInfo/知道了.png'" @click="close"></span>
					</span>
				</div>
                <div class="pop showInfo2">
					<span class="ce lazy ir pop_content" data-src="images/task1/底框拷贝.png">
						<span class="absolute ir effect btn_rule showInfo2Title" v-lefty="94" v-topy="-145" v-bg="showInfo2.title"></span>
						<span class="absolute ir effect btn_rule showInfo2Img" v-lefty="222" v-topy="141" v-bg="showInfo2.img"></span>
						<span class="mCe ir effect btn_rule showInfo2Content" v-lefty="22" v-topy="397" v-bg="showInfo2.content"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
                </div>

				<div class="pop inputAddress">
					<span class="ce lazy ir pop_content" data-src="images/inputAddress/底框拷贝.png">
						<span class="absolute ir effect btn_rule" v-lefty="107" v-topy="-150" v-bg="'images/inputAddress/小标题拷贝.png'"></span>
						<span class="absolute ir effect btn_rule myfont" v-lefty="74" v-topy="86">
							<div class="input-row">收货人：<input class="myfont" v-bind:value="inputData.name" placeholder="inp" /></div>
							<div class="input-row">联系电话：<input class="myfont" v-bind:value="inputData.phone" placeholder="inp" /></div>
							<div class="input-row">选择地址：<input class="myfont" v-bind:value="inputData.address" placeholder="inp" /></div>
							<div class="input-row">详细地址：<input class="myfont" v-bind:value="inputData.detailAddress" placeholder="inp" /></div>
							<div class="input-row">注：请填写正确地址，否则无法发货</div>
						</span>
						<span class="absolute ir effect btn_rule" v-lefty="216" v-topy="605" 
							v-bg="'images/inputAddress/确认兑换.png'" @click="confirmExchange()"></span>
						<span class="mCe ir effect lazy btn_close" data-src="images/btn_close.png" @click="close"></span>
					</span>
				</div>

				<transition-group name="fade">
					<div key="fade" v-show="fAlert.show" class="fadeAlert" v-html="fAlert.text"></div>
					<div key="fade" class="pages flex column align_center justify_center loading_logo" v-show="ajaxLoading">
						<img class="logo_img" src="images/logo.png" />
						<div class="relative mt_70 flex align_center justify_center">
							<img class="wait_dot one" src="images/dot.png" />
							<img class="ml_25 wait_dot two" src="images/dot.png" />
							<img class="ml_25 wait_dot three" src="images/dot.png" />
						</div>
					</div>
				</transition-group>
			</section>
		</section>

		<script src="//res1.i-lz.cn/plugin/bscroll.min.js"></script>
		<script src="//res1.i-lz.cn/plugin/vue.min.js"></script>
		<script src="//res1.i-lz.cn/plugin/zepto.min.js"></script>
		<script src="//res1.i-lz.cn/plugin/gsap.min.js"></script>
		<script src="//res1.i-lz.cn/plugin/howler.min.js"></script>
		<script src="js/common.js"></script>
        <!--<script src="js/index.js"></script>-->
		<script>
			var app = new Vue({
				mixins: [mixins.default],
				el: '#app',
				data: {
					...sysParam,
					appWidth: window.appWidth,
					appHeight: window.appHeight,
					width: 750,
					height: 1334,
					//页面唯一标识 - 在这里定义
					page: {
						index: false,
						taskList: false,
					},
					//滚动 - 有滚动的页面或弹窗，键和页面/弹窗的唯一标识对应，页面的唯一标识为page:中定义的，弹窗的唯一标识为定义弹窗时声明的class值（保证定义的时候为唯一值）
					scroll: {
						rule: null,
						lottery: null,
						mygift_have: null,
					},
					// 文案
					txt: {
						placeholder: {
							//
						},
					},
					//...自定义一些变量
					rule: {
						key: null,
					},
					taskDataList: [
						{},{},{},{},{},{},
                    ],
					activeRule: '',
					lotteryDataList: [],
					myGiftDataList: [],
					inputData: {
						name: '1', phone: '2', address: '3', detailAddress: '4',
					},
					inputCode: '',
					currentChoosedItem: null,
                    showInfo1: {},
                    showInfo2: {},
					lotteryImage: '',
				},
				watch: {
					//
				},
				created() {
					this.loadTaskList();
                    this.loadLotteryData();
					this.loadActiveRule();
					this.loadMyGiftData();
					setTimeout(() => this.loadTaskList(), 3000);
				},
				methods: {
                    goTask(taskNo) {

                    },
                    chooseShop() {
                         /*this.showInfo1 = {
                            title: 'images/showInfo/矢量智能对象拷贝17.png', // 'images/task1/小标题成功.png',
                            content: '助力成功',
                            closeBtn: 'images/showInfo/知道了.png',
                        }
                        this.showPop('showInfo1');*/
						/*this.showInfo2 = {
							title: 'images/task1/小标题成功.png',
							img: 'images/task1/icon拷贝2.png',
							content: 'images/task1/您已完成任务一，获得实物礼一份.png',
						};
						this.showPop('showInfo2');*/
                        // this.showPop('zhuli_fail');
						this.showInfo('nihao')
                    },
					showInfo(content) {
						this.showInfo1 = {
                            title: 'images/showInfo/矢量智能对象拷贝17.png', // 'images/task1/小标题成功.png',
                            content: content,
                            closeBtn: 'images/showInfo/知道了.png',
                        }
                        this.showPop('showInfo1');
					},
					verify() {
                        ajax({
                            url: sysParam.verifyApi,
                            data: {
                                "prize_id": this.currentChoosedItem.id,
                                "write_Off_code": this.inputCode,
                            }
                        }).then(res=>{
                            this.taskDataList = res.result_data;
                        });
                    },
					// 填卡任务
					fillCardTask() {

					},
					// 任务列表
					loadTaskList() {
						/*ajax({
							url: sysParam.ajaxUpdateUser,
							data: {  }
						}).then(res=>{
							this.taskDataList = res.result_data;
						}).catch(res=>{
						});*/
                        setTimeout(() => {
                            this.taskDataList = [
								{"id":"1","aid":"24092", "title":"","intro":"","sort":"1","start":"","end":"","status":Math.random()*4-2>>0,"statusText":""},
								{"id":"1","aid":"24092", "title":"","intro":"","sort":"1","start":"","end":"","status":Math.random()*4-2>>0,"statusText":""},
								{"id":"1","aid":"24092", "title":"","intro":"","sort":"1","start":"","end":"","status":Math.random()*4-2>>0,"statusText":""},
								{"id":"1","aid":"24092", "title":"","intro":"","sort":"1","start":"","end":"","status":Math.random()*4-2>>0,"statusText":""},
								{"id":"1","aid":"24092", "title":"","intro":"","sort":"1","start":"","end":"","status":Math.random()*4-2>>0,"statusText":""},
								{"id":"1","aid":"24092", "title":"","intro":"","sort":"1","start":"","end":"","status":Math.random()*4-2>>0,"statusText":""},	
                            ];
                            let statusBtnUrl = {
                                '-1': 'images/taskList/待解锁.png',
                                '-2': 'images/taskList/未开启.png',
                                '0': 'images/taskList/去完成.png',
                                '1': 'images/taskList/领取.png',
                                '2': 'images/taskList/已完成.png',
                            };
							for (let i = 0; i < this.taskDataList.length; i++) {
								this.taskDataList[i].statusBtnUrl = statusBtnUrl[this.taskDataList[i + ''].status];
							}
                        }, 1000);
					},
					taskBtnClicked(taskNo) {
						
					},
					// 活动规则
					loadActiveRule() {
						setTimeout(() => {
							this.activeRule = '规则';
						}, 1000);
					},
					// 中奖名单
					loadLotteryData() {
						/* setTimeout(() => {
							this.lotteryDataList = [
								{id:'', avatar: 'images/lottery/椭圆1055.png', nickname: '昵xxxxxxx称', giftName: '名称xxxxxxxxx'},
								{id:'', avatar: 'images/lottery/椭圆1055.png', nickname: '昵称xxxxxxxx', giftName: '名称xxxxxx'},
								{id:'', avatar: 'images/lottery/椭圆1055.png', nickname: '昵称xxxxxxxx', giftName: '名称xxxxxxxxxx'},
								{id:'', avatar: 'images/lottery/椭圆1055.png', nickname: '昵称', giftName: '名xxxxxxxxxxxxxxxxxxxxxx称'},
								{id:'', avatar: 'images/lottery/椭圆1055.png', nickname: '昵xxxxxxxxx称', giftName: '名xxxxxxxxx称'},
								{id:'', avatar: 'images/lottery/椭圆1055.png', nickname: '昵xxxxxxxxxxxxxx称', giftName: '名xxxxxxxxxxxxxxxxxxx称'},
							];
						}, 1000); */
						ajax({
							url: sysParam.awardList,
						}).then(res => {
							this.lotteryImage = res.result_data.award_list_pic;
						});
					},
					// 我的奖品
					loadMyGiftData() {
						/* setTimeout(() => {
							this.myGiftDataList = [
							    {
									"id":"1",
									"prize_id":"48544",
									"prize_name":"定制贴纸1张+宠物零食\/试吃装随机1份",
									"prize_pic": "",
									"task_id":"1",
									"type":1,
								},
							];
						}, 1000); */
						ajax({
							url: this.myGiftApi,
						}).then(res=>{
							this.myGiftDataList = res.result_data;
						});
					},
					confirmExchange() {
						// 确认兑换
						// inputData.name
						// inputData.phone
						// inputData.address
						// inputData.detailAddress
						let id = this.currentChoosedItem.id;
						let data = {id: id, extend: inputData};
						console.log(data);
						ajax({
							url: sysParam.submitDataApi,
							data: data
						}).then(res=>{
							this.taskDataList = res.result_data;
						})
					},
					//活动是否结束
					isAtvtEnd() {
						let isEnd = new Date() >= new Date((settings.endParticipation || '2099-12-31 00:00:00').replace(/-/g, '/'));
						if (isEnd) {
							this.showAlert(1, settings.discontinueTxt || '本次游戏已结束。请期待下次游戏开始哦!');
						}
						return isEnd;
					},
					//不要删除
					showLoadingPage() {
						$('#loading').removeClass('dis_none');
					},
					//加载完页面资源会自动执行到这个方法
					initEnd() {
						//以下为初始化滚动
						for (let scrollId in this.scroll) {
							try {
								this.scroll[scrollId] = BetterScroll.createBScroll('#' + scrollId, {
									scrollY: true,
									click: true,
									preventDefault: false,
									bounce: false,
									scrollbar: {
										fade: false,
										interactive: false, // 1.8.0 新增
									},
								});
							} catch (err) {}
						}
						$('#loading').addClass('dis_none');
						this.showPage('index');
						//...可以写进入页面后的一些逻辑
					},
					showRule() {
						this.popShow('rule');
					},
					showPage(name) {
						this.pageShow(name);
					},
					showPop(name) {
						this.popShow(name);
					},
				},
			});



			function ajax(b) {
				if (!app) app = {};
				app.ajaxLoading = true;
				return new Promise((resolve, reject) => {
					let url = b.url + window.location.search;
					$.ajax({
						type: b.type ? b.type : 'post',
						url,
						dataType: 'json',
						data: b.data ? b.data : {},
						timeout: 30000,
						success: function (data) {
							app.ajaxLoading = false;
							console.log(`success by result_code==${data.result_code}: req ${b.url} response data = `, data);
							if (b?.resolve == 1) {
								resolve(data);
							} else {
								data.result_code == 1 ? resolve(data) : reject(data);
							}
						},
						error: function () {
							app.ajaxLoading = false;
							reject({ result_code: 0, result_msg: '网络超时，请刷新后再试！' });
						},
					});
				});
			}
		</script>
	</body>
</html>
